import { GlobalStyle } from "./styles";
import Header from "./components/header";
import Home from "./components/Home";
import Detail from "./components/Detail/loadable";
import { Provider } from "react-redux";
import store from "./redux/store";
import { Route, Redirect } from "react-router-dom";
import React, { Component } from "react";
import Login from "./components/login";
import Write from "./components/write"
export default class App extends Component {
  render() {
    return (
      <div className="App">
        <GlobalStyle />
        <Provider store={store}>
          <Route path="/" component={Header} />

          <Route
            path="/"
            exact
            render={() => <Redirect to="/home"></Redirect>}
          />
          <Route path="/home" exact component={Home}></Route>
          <Route path="/detail/:id" exact component={Detail}></Route>
          <Route path="/login" exact component={Login}></Route>
          <Route path="/write" exact component={Write}></Route>
          {/* <Route path="/home" exact render={()=><div>home</div>}></Route>
      <Route path="/detail" exact render={()=><div>dettail</div>}></Route> */}
        </Provider>
      </div>
    );
  }
}
